<template>
    <div>
        <h1>子组件</h1>
    </div>
</template>

<script >
export default {
    props:["str"],
    data() {
        return {
            msg: "hello vue",
        }
    },
    methods: {
        changeMsg() {
            this.msg += "1";
        }
    },
    beforeCreate() {
        console.log("子组件：beforeCreate")
    },
    created() {
        console.log("子组件：created");
    },
    beforeMount() {
        console.log("子组件：beforeMount");
    },
    mounted() {
        console.log("子组件：mounted");
      },
    beforeUpdate() {
        console.log("子组件：beforeUpdate");
     },
    updated() {
        console.log("子组件：updated");
 
    },
    beforeUnmount(){
        console.log("子组件：beforeUnmount");
    },
    unmounted(){
        console.log("子组件：unmounted");
    }
}

</script>

<style lang="css" scoped></style>
